<html>
    <head>
        <title>Test results for ${test}</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <style type="text/css">
            body {
                font-family: Arial, Sans;
                margin: 0;
                padding: 0;
            }
            table {
                width: 100%;
            }
            #header {
                padding: 15px;
                margin-bottom: 20px;
            }
            #results {
                padding: 15px;
            }
            #header h1 {
                margin-top: 0;
            }
            #header.success {
                background: #81CF5A !important;
            }
            .passed span {
                background: #81CF5A !important;
                padding: 3px 5px;
            }
            #header.failed {
                background: #EF6868 !important;
            }
            .failed span {
                background: #EF6868 !important;
                padding: 3px 5px;
            }
            table .source {
                margin-top: 10px;
            }
            table .source span {
                color: #fff;
                font-size: 85%;
                padding: 1px 3px;
                background: #666;
            }
            table .sourceLine {
                border-left: 3px solid #c00;
                padding: 4px 3px;
                color: #000;
                font-size: 85%;
                margin-bottom: 10px;
            }
            .error {
                color: #c00;
            }
            table td {
                padding: 5px 0;
            }
        </style>
    </head>
    <body>
        
        <div id="header" class="block ${results.passed ? 'success' : 'failed'}">
            <h1>
                ${test}
            </h1>
            <p>
                ${results.passed ? 'SUCCESS' : 'FAILED'}
            </p>
        </div>
        
        <div id="results">
            <table>
                #{list items:results.results, as:'result'}
                <tr>
                    <td width="20%" class="${result.passed ? 'passed' : 'failed'}" valign="top">
                        <span>${result.name}</span>
                    </td>
                    <td class="${result.error ? 'error' : ''}" valign="top">
                        #{if result.error}
                        <strong>${result.error}</strong>
                        #{if result.sourceInfos}
                        <div class="source">
                            <span>${result.sourceInfos} :</span>
                        </div>
                        <div class="sourceLine">
                            <span>
                                ${play.utils.Utils.open(result.sourceFile, result.sourceLine) ? ('<a href="' + play.utils.Utils.open(result.sourceFile, result.sourceLine) + '">').raw() : ''}
                                    ${result.sourceCode}
                                ${play.utils.Utils.open(result.sourceFile, result.sourceLine) ? '</a>'.raw() : ''}
                            </span>
                        </div>
                        #{/if}
                        #{if result.trace}
                        <a href="#" onclick="toggle_trace(this); return false;">Show trace</a>
                        <pre data-role="trace">${result.trace.raw()}</pre>
                        #{/if}
                        #{/if}
                        #{else}
                        Ok
                        #{/else}
                    </td>
                    <td width="5%" align="right" class="time" valign="top">
                        ${result.time} ms
                    </td>
                </tr>
                #{/list}
            </table>
        </div>
        
    </body>
</html>
